home *** CD-ROM | disk | FTP | other *** search
/ Personal Computer World 2009 February / PCWFEB09.iso / Software / Resources / Burning & Media / GB-PVR 1.2.13 / GBPVR10213.msi / Cabs.w1.cab / library.css164 < prev    next >
Text File  |  2008-01-11  |  10KB  |  404 lines
  1. /* 
  2. CSS for Library page.  This single page supports the Video, Music and Picture views.
  3. */
  4.  
  5. html {
  6.     overflow-y:hidden;
  7.     overflow-x:hidden;
  8. }
  9.  
  10. .libraryTitle{
  11.     float:left;    
  12.     position:relative;
  13.     padding: 5px 0px 0px 5px;
  14.     font-size: 14px;
  15.     font-weight:bold;
  16. }
  17.  
  18. #MEDIA_HEADER {
  19.     /*
  20.     Container for the entire fixed row containing the various buttons.
  21.     */
  22.     position:absolute;
  23.     width:100%; 
  24.  
  25.     left:0; 
  26.  
  27.     color:#000000;
  28.     overflow:hidden;
  29. }
  30. #TOP_BUTTONS {
  31.     /* 
  32.     Container for the top buttons photo controls and stream controls
  33.     */
  34.     display: inline-block;
  35.     font-weight:normal;
  36.     font-size:11px;
  37.     margin-left:1px;
  38.     margin-bottom: 3px;
  39.     padding: 2px 4px 3px 4px;
  40.     height:55px;
  41.     width:100%;
  42.     vertical-align: middle;
  43.     line-height: 18px;
  44.     float:left;
  45. }
  46.  
  47. #STREAM_DIV {
  48.     /* contains the message that streaming is active */
  49.     font-weight:bold;
  50.     color: #0000cd;
  51.     font-variant: small-caps;
  52.     font-size:11px;
  53.     float:left;
  54.     background: url(../../../rotating_arrow.gif) no-repeat left;
  55.     margin: 3px 5px 0px 10px;
  56. }
  57.  
  58. #PATH_NAME {
  59.     font-size:13px;
  60.     font-weight: bold;
  61.     background-color: #99BBEE;
  62.     padding: 2px 4px 2px 4px;
  63.     border: 1px solid #808080;
  64.     margin: 0px 5px 0px 0px;
  65.     clear:both;
  66.     height:22px;
  67.     line-height: 22px;
  68.     vertical-align:bottom;
  69.     width:98%;
  70.     position:absolute;
  71.     top:35px;
  72. }
  73. #NAVIGATION_MUSIC, #NAVIGATION_VIDEO, #NAVIGATION_PHOTO {
  74.     width:100%;
  75.     float:left;
  76. }
  77. #GRAPHICS {
  78.     top: 200px;
  79.     z-index: 9000;
  80.     float:left;
  81.     margin: 2px 2px 2px 0px;
  82.     padding: 0px;
  83.     background-color:#368;
  84.     overflow-x:auto;
  85.     overflow-y:auto;
  86.     width:50%;
  87.     left:40%;
  88.     position:fixed;
  89. }
  90. #ALBUM_ART {
  91.     left:70%;
  92.     float:left;
  93.     position:fixed;
  94. }
  95. .folder, .file {
  96.     font-weight:normal;
  97.     font-size:11px;
  98.     margin: 2px 5px 0px 0px;
  99.     padding: 2px 4px 2px 4px;
  100.     border: 1px solid #a0a0a0;
  101.     background-color: #33AADD;
  102.     clear:both;
  103.     overflow-y:auto;
  104.     overflow-x:hidden;
  105. }
  106. .file {
  107.     color:#ffffff;
  108.     display: inline-block;
  109.     background-color: #33AADD;
  110. }
  111. .file A, .file A:active, .file A:visited, .file A:hover {
  112.     color:#ffffff;
  113.     display: inline-block;
  114.     background-color: #33AADD;
  115. }
  116.  
  117. a.toolTip{
  118.     position:relative; /*this is the key*/
  119.     color:#ffffff;
  120.     float:left;
  121.     text-decoration:none;
  122. }
  123.  
  124. a.toolTip:hover{z-index:25;
  125.      }
  126.  
  127. a.toolTip span{display: none;
  128.     z-index:25;
  129. }
  130.  
  131. a.toolTip:hover span{ /*the span will display just on :hover state*/
  132.     display:block;
  133.     position:absolute;
  134.     padding:2px;
  135.     bottom:-2.5em; left:1em; width:65em;
  136.     border:1px solid #0cf;
  137.     background-color:#cff; 
  138.     color:#000000;
  139.     text-align:left; 
  140.     font-size:smaller;
  141. }
  142.  
  143. .folder {
  144.     border: 1px solid #000000;
  145.     background-color: #33AADD;
  146. }
  147. .folder A {
  148.     color:#000000;
  149.     text-decoration:none;
  150.     background-color: #33AADD;
  151. }
  152. .folder A:active, .folder A:visited {
  153.     color:#000000;
  154. }
  155. .folder A:hover {
  156.     color: #0000ff;
  157.     text-decoration: underline;
  158. }
  159.  
  160. .mediaButtons A, .streamButtons A {
  161.     text-decoration: none;
  162.     font-size: 11px;
  163.     font-weight:bold;
  164.  
  165.     display: block;
  166.     
  167.     border: 1px solid #000000;
  168.     margin: 4px 4px 0px 0px;
  169.  
  170.     padding: 2px 6px 2px 6px;
  171.  
  172.     background-color: #0066EE;
  173.     color: #000000;
  174.     
  175.     /*  */
  176.     white-space: nowrap;
  177.     text-align: center;
  178.  
  179.     overflow: visible;
  180.     float:left;
  181.     /*border-right: 0px;*/
  182. }
  183. .mediaButtons A:active, .mediaButtons A:visited, .streamButtons A:active, .streamButtons A:visited {
  184.     color: #000000;
  185. } 
  186. .mediaButtons A:hover, .streamButtons A:hover, .streamButtons A:hover, .streamButtons A:hover  {
  187.     color: #000000;
  188.     background-color: #cfe6a1;
  189. } 
  190. .butStream A {
  191. /*    background-image: */
  192. }
  193. .activeText {
  194.     line-height:25px;
  195.     vertical-align: middle;
  196.     text-decoration: blink;
  197.     color: #0000ff;
  198.     font-weight:bold;
  199.     font-variant: small-caps;
  200.     margin-left:25px;
  201.     margin-right:10px;
  202. }
  203. /*
  204. *********************************************************************************************************************
  205. Absolute Positioning and Height                                                            
  206.  
  207. These values are consolidated into one place to make it easier to change size attributes seeing as changing
  208. any one of these values can affect all the others.
  209.  
  210. These values are the key values for maintaining proper size, positioning and scrolling behavior.
  211. *********************************************************************************************************************
  212. */
  213. BODY {
  214.     /*
  215.     In order to maintain proper positioning and fixed scrolling, these values must be specified
  216.     Top value is the same as the top value of #CONTENTS.
  217.     Bottom value would be the height of the footer area minus the height of the divider    for the footer.
  218.     */
  219.     margin-top:199px;
  220.     margin-bottom:49px;
  221. }
  222. #DIV_HEADER {
  223.     /*
  224.     This is the divider line between the date section above and the main content area
  225.      */
  226.     top:132px;
  227.     height:1px;
  228. }
  229. #MEDIA_HEADER {
  230.     /* 
  231.     This section contains the main, non-scrolling timeline at the top of the content section.
  232.     */
  233.     position: absolute;
  234.     top:132px;
  235.     height:66px;
  236. }
  237.  
  238. #DIV_DATELINE {
  239.     /*
  240.     This is the divider line between the main header above and the section containing the server time
  241.      */
  242.     top:91px;
  243. }
  244. #DATELINE {
  245.     /* 
  246.     This is the section containing the server time, date, etc.
  247.     */
  248.     top:92px;
  249. }
  250. #REMINDER_DIV, #DATELINE {
  251.     /* Height of these individual elements would normally be the same as #DATELINE */
  252.     /*    Contains the Genre, date, time and GO button.*/
  253.     height:40px;
  254. }
  255.  
  256. #DIV_CONTENTS {
  257.     /*
  258.     This is A divider line between any fixed top section within the content area and the content itself.
  259.     This is typically used in the guide page to separate the showtime header from the content.
  260.     In other pages which don't need this functionality it can simply be hidden.
  261.      */
  262.     top:178px;
  263.     height:1px;
  264. }
  265. #CONTENTS {
  266.     /* 
  267.     This is the main content area.
  268.     To ensure proper scrolling behavior it MUST be absolutely positioned.
  269.     Both top and bottom values must be specified.
  270.     Top value would be the height of all fixed content above it.
  271.     Bottom value would be the height of the footer area minus the height of the divider    for the footer.
  272.      */
  273.     top:179px;
  274.     bottom:49px;
  275.     padding-left:3px;
  276.     direction:ltr;text-align:left;
  277.     overflow-y:auto;
  278.     overflow-x:hidden;
  279. }
  280. #ZOOM_CONTROLS, #ROTATE_CONTROLS {
  281.     display: inline-block;
  282.     font-size: 12px;
  283.     line-height: 24px;
  284.     vertical-align: middle;
  285.     margin: 0px 0px 0px 3px;
  286.     color:#CCF;
  287. }
  288. #SPACER {
  289.     float:left;
  290.     width:33%;
  291. }
  292. .ctrlLabel {
  293.     font-weight: bold;
  294.     font-size:13px;
  295.     padding-left:10px;
  296. }
  297. #ZOOM_CONTROLS, #ROTATE_CONTROLS {
  298.     /* contains the zoom and rotate controls on the photo page */
  299.  
  300.     /* due to IE and firefox differences, vertical spacing is adjusted for best appearance */
  301.     margin-left:20%;
  302.     padding-left:5px;
  303. }
  304. #ZOOM_CONTROLS INPUT, #ROTATE_CONTROLS INPUT {
  305.     /* contains the zoom and rotate controls on the photo page */
  306.  
  307.     /* due to IE and firefox differences, vertical spacing is adjusted for best appearance */
  308.     vertical-align: top;
  309. }
  310. #NAVIGATION_MUSIC #NAV_TREE {
  311.     float:left;
  312.     width:67%;
  313. }
  314. #NAVIGATION_MUSIC #GRAPHICS {
  315.     overflow: visible;
  316. }
  317. #NAVIGATION_PHOTO #NAV_TREE {
  318.     float:left;
  319.     width:33%;
  320. }
  321. #NAVIGATION_VIDEO #NAV_TREE {
  322.     float:left;
  323.     width:100%;
  324. }
  325. #PHOTO_HEADER {
  326.     /*
  327.     div used simply to left-align the photo manipulation controls with the actual photo
  328.     margin is set to the same value as the width of #NAV_TREE for proper alignment.
  329.     */
  330.     width:33%;
  331.     float:left;
  332. }
  333. #FILE_LIST {
  334.     border: 1px solid #000000;
  335.     padding: 3px 5px 5px 10px;
  336.     margin: 3px 5px 0px 0px;
  337.     display: inline-block;
  338.     background-color: #33AADD;
  339.     line-height: 15px;
  340. }
  341. #NAVIGATION_PHOTO #NAV_TREE .file {
  342.     font-weight:normal;
  343.     font-size:11px;
  344.     margin: 0;
  345.     padding: 0;
  346.     border: none;
  347.     height: auto;
  348.     clear:both;
  349.     background-color: #33AADD;
  350. }
  351. #NAVIGATION_PHOTO #NAV_TREE .file A {
  352.     color: #000000;
  353.     text-decoration: none;
  354. }
  355. #NAVIGATION_PHOTO #NAV_TREE .file A:active, #NAVIGATION_PHOTO #NAV_TREE .file A:visited {
  356.     color: #000000;
  357. }
  358. #NAVIGATION_PHOTO #NAV_TREE .file A:hover {
  359.     color: #0000ff;
  360.     text-decoration: underline;
  361. }
  362. .butStreamAll, .butPlayAll, .butDownloadAll, .butStream, .butPlay, .butDownload, .streamerSettings {
  363.     /* 
  364.     Basic styling for all the media buttons on the page
  365.     */
  366.     display: inline-block;
  367.     height: 25px;
  368.     float:left;
  369. }
  370. .butStreamAll A, .butPlayAll A, .butDownloadAll A, .butStream A, .butPlay A, .butDownload A, .streamerSettings A {
  371.     /* 
  372.     Visual styling for all the media buttons on the page
  373.     */
  374.     text-decoration: none;
  375.     font-size: 11px;
  376.     font-weight:bold;
  377.  
  378.     display: inline-block;
  379.     
  380.     border: 1px solid #000000;
  381.     margin: 4px 4px 0px 0px;
  382.  
  383.     padding: 2px 6px 2px 6px;
  384.  
  385.     background-color: #0066EE;
  386.     color: #000000;
  387.     
  388.     white-space: nowrap;
  389.     text-align: center;
  390.  
  391.     float:left;
  392. }
  393. .butStreamAll A:active, .butPlayAll A:active, .butDownloadAll A:active, .butStream A:active, .butPlay A:active, .butDownload A:active, .streamerSettings A:active {
  394.     color: #000000;
  395.     background-color: #0066EE;
  396. } 
  397. .butStreamAll A:visited, .butPlayAll A:visited, .butDownloadAll A:visited, .butStream A:visited, .butPlay A:visited, .butDownload A:visited, .streamerSettings A:visited {
  398.     color: #000000;
  399.     background-color: #0066EE;
  400. } 
  401. .butStreamAll A:hover, .butPlayAll A:hover, .butDownloadAll A:hover, .butStream A:hover, .butPlay A:hover, .butDownload A:hover, .streamerSettings A:hover {
  402.     color: #000000;
  403.     background-color: #00BBFF;
  404. }